<template>
  <div>
    <el-card class="box-card" style="text-align: center;margin: -55px auto;background: #f6f6f7;">
      <el-container>
        <app-header></app-header>
        <el-main>
          <el-breadcrumb separator-class="el-icon-arrow-right" style="width: 1200px;margin: 0 auto;">
            <el-breadcrumb-item>您所在的位置：</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item>特色资源</el-breadcrumb-item>
            <el-breadcrumb-item :to="{path:'/infoList'}">水循环遥感产品</el-breadcrumb-item>
            <el-breadcrumb-item>详情</el-breadcrumb-item>
          </el-breadcrumb>
          <el-card shadow="hover" style="margin-top: 10px;text-align: left;padding-left: 30px;">
            <div slot="header" class="clearfix">
              <h2>{{info.name}}</h2>
            </div>
            <div class="text item">
              <h4>基本信息</h4>
              <h4>数据摘要</h4>
              <h4>数据来源</h4>
              <h4>数据说明</h4>
              <h4>数据下载</h4>
              <div style="margin-left: 30px;">
              <span>{{info.name}}</span>
                <el-link :underline="false" type="primary" @click="download()">
                  下载
                </el-link>
              </div>
            </div>
          </el-card>
        </el-main>
        <el-footer>Footer</el-footer>
      </el-container>
    </el-card>
  </div>
</template>

<script>
import myHeader from '../../components/myHeader'
import {decrypt} from '@/util/rsaEncrypt'
import {selectUploadEntityById, downloadFile} from '@/api/news'
export default {
  data () {
    return {
      info: {}
    }
  },
  components: {
    'app-header': myHeader
  },
  created () {
    const id = localStorage.getItem('id')
    console.log(id)
    const data = {
      id: decrypt(id)
    }
    selectUploadEntityById(data).then(res => {
      if (res.data.status === 1005) {
        this.$message.success('查询成sss功')
        this.info = res.data.data
        console.log(res.data.data)
      } else {
        this.$message.error('查询失败')
      }
    })
  },
  methods: {
    download () {
      const id = localStorage.getItem('id')
      console.log('idid')
      console.log(id)
      const data = {
        id: id
      }
      downloadFile(data).then(res => {
        if (res.status === 200) {
          let blob = res.data
          let reader = new FileReader()
          reader.readAsDataURL(blob)
          reader.onload = (e) => {
            let a = document.createElement('a')
            a.download = res.headers.filename
            a.href = e.target.result
            document.body.appendChild(a)
            a.click()
            document.body.removeChild(a)
          }
        }
      })
    }
  }
}
</script>

<style scoped>
.el-header, .el-footer {
  background-color: #1a75ce;
  text-align: center;
  line-height: 60px;
}
</style>
